<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>联系我们 - 我的电商网站</title>
    <link rel="stylesheet" href="/static/css/style.css">
</head>
<body>
    <header>
        <nav>
            <div class="logo">电商平台</div>
            <ul>
                <li><a href="/">首页</a></li>
                <li><a href="/products">商品</a></li>
                <li><a href="/about">关于我们</a></li>
                <li><a href="/contact" class="active">联系我们</a></li>
            </ul>
        </nav>
    </header>

    <main>
        <section class="contact-section">
            <h1>联系我们</h1>
            
            <div class="contact-container">
                <div class="contact-info">
                    <h2>联系方式</h2>
                    <div class="info-item">
                        <i class="icon">📍</i>
                        <p>北京市朝阳区科技园A座1001室</p>
                    </div>
                    <div class="info-item">
                        <i class="icon">📞</i>
                        <p>400-123-4567</p>
                    </div>
                    <div class="info-item">
                        <i class="icon">✉️</i>
                        <p>contact@example.com</p>
                    </div>
                    <div class="info-item">
                        <i class="icon">⏰</i>
                        <p>周一至周五: 9:00 - 18:00</p>
                    </div>
                    
                    <div class="social-media">
                        <h3>关注我们</h3>
                        <div class="social-icons">
                            <a href="#"><i class="icon">微信</i></a>
                            <a href="#"><i class="icon">微博</i></a>
                            <a href="#"><i class="icon">抖音</i></a>
                        </div>
                    </div>
                </div>
                
                <div class="contact-form">
                    <h2>发送消息</h2>
                    <form id="contactForm">
                        <div class="form-group">
                            <label for="name">姓名</label>
                            <input type="text" id="name" name="name" required>
                        </div>
                        <div class="form-group">
                            <label for="email">电子邮箱</label>
                            <input type="email" id="email" name="email" required>
                        </div>
                        <div class="form-group">
                            <label for="subject">主题</label>
                            <input type="text" id="subject" name="subject" required>
                        </div>
                        <div class="form-group">
                            <label for="message">消息内容</label>
                            <textarea id="message" name="message" rows="5" required></textarea>
                        </div>
                        <button type="submit" class="btn">发送消息</button>
                    </form>
                </div>
            </div>
            
            <div class="map-container">
                <iframe src="https://maps.example.com" frameborder="0" allowfullscreen></iframe>
            </div>
        </section>
    </main>

    <!-- <footer>
        <p>&copy; 2023 电商平台. 保留所有权利.</p>
    </footer> -->

    <script src="/static/js/contact.js"></script>
</body>
</html>